import { Button, Checkbox, Form, Input, message } from 'antd';
import React, { useEffect } from 'react';
import "./index.css"
import { userLogin } from "../../http/request";
import { useNavigate } from 'react-router-dom';


const Login = () => {
    const Navigate = useNavigate()
    const onFinish = (values) => {
        console.log('Success:', values);
        //表单数据
        let data = {
            adminname: values.adminname,
            password: values.password
        }
        //路由

        //必须同意协议
        if (values.remember) {
            //登录请求
            userLogin(data).then(res => {
                //解构数据
                // console.log(res.data);
                const { code, message: msg } = res.data
                if (code == "200") {
                    message.success(msg)
                    localStorage.setItem("token", res.data.data.token)
                    localStorage.setItem("adminname", res.data.data.adminname)
                    Navigate("/home")
                } else {
                    message.error(msg)
                }
            })
        } else {
            message.error("请同意协议")
        }
    };

    const onFinishFailed = (errorInfo) => {
        console.log('Failed:', errorInfo);
    };

    return (
        <Form
            name="basic"
            labelCol={{ span: 8 }}
            wrapperCol={{ span: 16 }}
            initialValues={{ remember: true }}
            onFinish={onFinish}
            onFinishFailed={onFinishFailed}
            autoComplete="off"
        >
            <Form.Item
                label="用户名"
                name="adminname"
                rules={[{ required: true, message: '请输入你的用户名!' }]}
            >
                <Input />
            </Form.Item>

            <Form.Item
                label="密码"
                name="password"
                rules={[{ required: true, message: '请输入你的密码!' }]}
            >
                <Input.Password />
            </Form.Item>

            <Form.Item name="remember" valuePropName="checked" wrapperCol={{ offset: 8, span: 16 }}>
                <Checkbox>同意我</Checkbox>
            </Form.Item>

            <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                <Button type="primary" htmlType="submit">
                    提交
                </Button>
            </Form.Item>
        </Form>
    );
};

export default Login;

